<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>提现审核列表</title>
    <link rel="stylesheet" type="text/css" th:href="@{/js/layui/css/layui.css}" media="all">
    <link rel="stylesheet" type="text/css" th:href="@{/css/fyn/style.css/}" media="all">
    <link rel="stylesheet" type="text/css" th:href="@{/css/fyn/my.css/}" media="all">

</head>
<body class="body">

<script type="text/html" id="topOperate">
    <div class="my-btn-box layui-form">
        <div class="layui-btn-container">
            <button class="layui-btn layui-btn-sm" lay-event="exportExcel"><i class="layui-icon layui-icon-download-circle"></i>导出</button>
        </div>
        <!--<span class="fl">-->
             <!--<button class="layui-btn layui-btn-sm" lay-event="toSaveHj">-->
                 <!--<i class="layui-icon"></i>汇聚余额设置-->
             <!--</button>-->
            <!--<button class="layui-btn layui-btn-sm" lay-event="toSaveXs">-->
                <!--<i class="layui-icon"></i>新生余额设置-->
            <!--</button>-->
        <!--</span>-->
    </div>
</script>

<div class="my-btn-box layui-form">
    <!--<div class="layui-input-inline">-->
        <!--<label>汇聚余额：<span style="color: red;font-weight: bold;">[[${hjBalance}]]</span></label>-->
    <!--</div>-->
    <!--<div class="layui-input-inline">-->
        <!--<label>新生余额：<span   style="color: red;font-weight: bold;">[[${xsBalance}]]</span></label>-->
    <!--</div>-->
    <div class="layui-input-inline">
        <label>当日提现总额（已审核）：<span style="color: red;font-weight: bold;">[[${currWithdrawMoney}]]</span></label>
    </div>
    <span class="fr">
        <div class="layui-input-inline">
            <select class="layui-select" lay-filter="status">
                 <option value="">选择审核状态</option>
                 <option value="0">待审核</option>
                 <option value="1">审核通过</option>
                 <option value="2">拒绝</option>
                 <!--<option value="3">线下转账</option>-->
                 <!--<option value="4">处理中</option>-->

            </select>
        </div>
        <div class="layui-input-inline">
            <input type="text" autocomplete="off" name="userId" placeholder="申请人ID" class="layui-input height33">
        </div>
        <div class="layui-input-inline">
            <input type="text" autocomplete="off" name="recommendCode" placeholder="邀请码（上级）" class="layui-input height33">
        </div>
          <div class="layui-input-inline">
              <input type="text" name="checkTime" autocomplete="off" class="layui-input height33" id="checkTimeId"  placeholder="审核时间">
          </div>
        <button class="layui-btn layui-btn-sm" id="search"><i class="layui-icon">&#xe615;</i></button>
    </span>
</div>
<div id="auditForm" class="layui-form" lay-filter="auditForm" style="padding: 20px 0 0 0; display: none">
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">是否通过</label>
            <div class="layui-input-inline">
                <input type="checkbox" lay-verify="required" checked="" lay-filter="state"
                       id="authState" name="authState" lay-skin="switch" lay-text="通过|拒绝">
            </div>
        </div>
        <div class="layui-inline" id="remarkId" style="display: none;">
            <label class="layui-form-label">审核备注</label>
            <div class="layui-input-inline">
                <input type="text" class="layui-input" lay-verify="required" lay-filter="authRemark" id="authRemark" name="authRemark">
            </div>
        </div>
    </div>
    <div class="layui-form-item layui-hide">
        <input type="button" lay-submit lay-filter="auditForm-submit" id="auditForm-submit" value="确认">
    </div>
</div>
<!-- 表格 -->
<div id="dateTable" lay-filter="event"></div>
<div class="height50"></div>

<script th:src="@{/js/layui/layui.js}"></script>
<script th:src="@{/js/fyn/index.js}"></script>
<script th:src="@{/js/fyn/my.js}"></script>
<script type="text/javascript" th:src="@{/js/vip/vip_comm.js}"></script>
<script type="text/javascript" th:src="@{/js/vip/vip_table.js}"></script>
<script type="text/javascript" th:inline="javascript">

    // layui方法
    layui.use(['table', 'form', 'laypage', 'layer', 'vip_table','laydate'], function () {

        // 操作对象
        var form = layui.form
            , table = layui.table
            , layer = layui.layer
            , vipTable = layui.vip_table
            , laydate = layui.laydate
            , $ = layui.jquery;

        var tableData = [];

        layui.form.on('switch(state)', (data) => {
            // 处理点击事件
            console.log(data.elem.checked)
            if (data.elem.checked) {
                $("#remarkId").hide();
                $('#authRemark').val("");
            }else {
                $("#remarkId").show();
            }
        })

        //审核时间
        var checkTime = laydate.render({
            elem: '#checkTimeId',
            type: 'date',
            format: 'yyyy-MM-dd',
            trigger:'click',
            value: '',
            done: function(value, date){
            }
        });

        // 表格渲染
        var tableIns = table.render({
            elem: '#dateTable'                  //指定原始表格元素选择器（推荐id选择器）
            , height: "full"    //容器高度
            // , skin: 'line'
            , even: 'true'
            , cols: [[
                //标题栏
                {field: 'userId', title: '申请人ID', minWidth: '100', align: 'center'}
                ,{field: 'userNick', title: '申请人昵称', minWidth: '100', align: 'center'}
                ,{field: 'parentCode', title: '邀请码(上级)', minWidth: '100', align: 'center'}
                // , {field: 'parentUserId', title: '用户ID(上级)', minWidth: '120', align: 'center'}
                // , {field: 'parentUserNick', title: '昵称(上级)', minWidth: '120', align: 'center'}
                // , {field: 'parentPhone', title: '手机号(上级)', minWidth: '120', align: 'center'}
                , {field: 'money', title: '提现金额', align: 'center',  minWidth: '100', templet: function (d) {
                       return Math.floor(d.money);
                }}
                , {field: 'cardName', title: '银行卡人信息', align: 'center',  minWidth: '120'}
                , {field: 'cardNo', title: '银行卡号', align: 'center',  minWidth: '100'}
                , {field: 'cardBank', title: '开户行', align: 'center', minWidth: '100'}
                , {field: 'cardBankChild', title: '开户行支行', align: 'center', minWidth: '100', templet: function (d) {
                        var cardBankChild = d.cardBankChild == null ? '' : d.cardBankChild;
                        if (cardBankChild.indexOf("http") != -1) {
                            return "<a onclick=\"seeBigImg ('" + cardBankChild + "')\" style='margin-left: 5px;'><img src='" + cardBankChild + "' width='40' height='40'  /></a>";
                        }
                        return cardBankChild;
                }}
                , {field: 'userRemark', title: '用户备注', align: 'center', minWidth: '100'}
                , {field: 'memo', title: '提现备注', align: 'center', minWidth: '100'}
                , {field: 'refuseReason', title: '审核备注', align: 'center',  minWidth: '100'}
                ,{field: 'status', title: '状态', align: 'center',  minWidth: '100', templet: function (d) {
                    var status = d.status;
                    if (status == 0) {
                        return "待审核";
                       }else if (status == 1 || status == 3) {
                        return "审核通过";
                       }else if (status == 2){
                        return "拒绝";
                       }
                } }
                // ,{
                //     field: 'checkTime',
                //     align: 'center',
                //     title: '审核时间',
                //     sort: true,
                //     minWidth: '100',
                //     templet: function (d) {
                //         return new Date(d.checkTime).Format("yyyy-MM-dd hh:mm:ss");
                //     }
                // }
                ,{
                    field: 'ctime',
                    align: 'center',
                    title: '创建时间',
                    sort: true,
                    minWidth: '100',
                    templet: function (d) {
                        return new Date(d.ctime).Format("yyyy-MM-dd hh:mm:ss");
                    }
                }
                , {
                    title: '操作', align: 'center', minWidth: '200', rowspan: 4 , templet: function (d) {
                        if (d.status == 0) {
                            return "<a class=\"layui-btn  layui-btn-danger layui-btn-xs\" lay-event=\"groupMember\"><i class=\"layui-icon layui-icon-list\"></i>审核</a>\n" +
                            "<a class=\"layui-btn layui-btn-xs\" lay-event=\"balanceDetail\"><i class=\"layui-icon layui-icon-list\"></i>余额明细</a>\n"
                                // "<i class=\"layui-icon layui-icon-ok-circle\" style=\"cursor: pointer\" lay-event=\"withdraw\" title=\"线下转账\">线下转账</i>\n" +
                                ;
                        } else {
                            return "<a class=\"layui-btn layui-btn-xs\" lay-event=\"balanceDetail\"><i class=\"layui-icon layui-icon-list\"></i>余额明细</a>";
                        }
                    }
                } //这里的toolbar值是模板元素的选择器
                ]]
            , id: 'dataCheck'
            , url: [[${basePath}]] + '/balance/withdraw/list'
            , method: 'get'
            , page: true
            , cellMinWidth: 'auto'
            , limits: [10, 30, 60, 90, 150, 300]
            , toolbar: '#topOperate'
            , limit: 10 //默认采用0
            , loading: true
            // , where: {name: $("input[name='name']").val()}
            , done: function (res, curr, count) {
                //如果是异步请求数据方式，res即为你接口返回的信息。
                //如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度
                $("td[data-field='content']").each(function () {
                    $(this).find(".layui-table-cell").removeClass('layui-table-cell');
                });
                tableData = res.data;
            }
        });

        var status = null;

        //头工具栏事件
        table.on('toolbar(event)', function (obj) {
            var checkStatus = table.checkStatus(obj.config.id);
            var data = checkStatus.data;
            if (data.length == 0){
                data = table.cache;
            }
            switch (obj.event) {

                case 'exportExcel':
                    // table.exportFile(tableIns.config.id, tableData, 'xlsx', 'example.xlsx', {cols: 1000});
                    var globalParams = {
                        userId: $("input[name='userId']").val(),
                        status: status,
                        checkTime: $("#checkTimeId").val(),
                        recommendCode: $("input[name='recommendCode']").val()
                    };
                    $.ajax({
                        type: "get",
                        url: [[${basePath}]] + "/balance/exportExcel",
                        data: {
                            userId: $("input[name='userId']").val()
                            ,status: status
                            ,checkTime: $("#checkTimeId").val()
                            ,recommendCode: $("input[name='recommendCode']").val()
                        },
                        success: function (res) {
                            // window.open([[${basePath}]] + "/balance/exportExcel?status=1");
                            // 构建请求 URL
                            var url = [[${basePath}]] + "/balance/exportExcel?";
                            // 构建请求 URL
                            for (var key in globalParams) {
                                if (globalParams[key]) {
                                    url += key + "=" + encodeURIComponent(globalParams[key]) + "&";
                                }
                            }
                            // 移除结尾多余的 & 符号
                            url = url.replace(/&$/, "");
                            // 打开新窗口下载文件
                            window.open(url);
                        }
                    });
                    break;
            }
        });

        table.on('tool(event)', function (obj) {
            var data = obj.data;
            if (obj.event === 'balanceDetail') {
                // window.open([[${basePath}]] + '/balance/detail/index?userId=' + data.userId, "_blank");
                layer.open({
                    type: 2,
                    title: '余额明细',
                    shadeClose: true,
                    shade: 0.2,
                    maxmin: true, //开启最大化最小化按钮
                    area: ['1200px', '500px'],
                    content: [[${basePath}]] + '/balance/detail/index?userId=' + data.userId
                });

            }
            if (obj.event === 'withdraw') {
                layer.confirm("确定将状态变为已审核？", {
                    icon: 3,
                    title: '提示'
                }, function (index) {
                    $.ajax({
                        type: "post",
                        url: [[${basePath}]] + "/balance/withdraw/check",
                        data: {id: data.id, status: 3},
                        success: function (res) {
                            if (res.success) {
                                layer.msg("操作完成", {icon: 1});
                                setTimeout(function () {

                                }, 1500);
                                layer.close(index);
                                tableIns.reload();
                            } else {
                                layer.alert(res.msg, {icon: 2})
                            }
                        }
                    });
                });
            }
            if (obj.event === 'groupMember') {
                var authRemark = "";
                $('#authState').attr("checked", true);
                layer.open({
                    title: '提现审核'
                    ,btn: ['确定', '取消']
                    ,type : 1
                    ,content: $('#auditForm')
                    ,yes: function(index, layero){
                        var authState = $('#authState').prop('checked') ? 3 : 2;
                        if (2 == authState) {
                            authRemark = $('#authRemark').val();
                        }
                        var tips = (3 == authState) ? '确认审核为通过？' : '确定驳回？';

                        layer.confirm(tips, function(index){
                            $.ajax({
                                url: [[${basePath}]] + "/balance/withdraw/check",
                                data: {id: data.id, status: 1}
                                ,data:{
                                    id: data.id,
                                    status: authState,
                                    reason: authRemark
                                 }
                                ,type:'post'
                                ,success : function(res) {
                                    if(res.success) {
                                        layer.closeAll();
                                        tableIns.reload();
                                        layer.msg("审核通过", {icon: 1});
                                        window.location.reload();
                                    }
                                    else {
                                        tableIns.reload();
                                        layer.closeAll();
                                        layer.msg(res.msg, {icon: 2});
                                        window.location.reload();
                                    }
                                }
                            });
                        });
                    },
                    btn2: function () {
                        $('#authRemark').val("");
                        layer.close();
                        window.location.reload();
                    }
                });
                // layer.confirm("请选择审核状态", {
                //     icon: 3,
                //     btn: ['通过', '拒绝'],
                //     title: '提示'
                // }, function (index) {
                //     $.ajax({
                //         type: "post",
                //         url: [[${basePath}]] + "/balance/withdraw/check",
                //         data: {id: data.id, status: 1},
                //         success: function (res) {
                //             if (res.success) {
                //                 layer.msg("操作完成", {icon: 1});
                //                 setTimeout(function () {
                //
                //                 }, 1500);
                //                 layer.close(index);
                //
                //                 tableIns.reload();
                //             } else {
                //                 layer.msg(res.msg, {icon: 2}, 2000);
                //             }
                //         }
                //     });
                // }, function (index) {
                //     layer.prompt({title: '请输入拒绝理由', formType: 2}, function (pass, index) {
                //         $.ajax({
                //             type: "post",
                //             url: [[${basePath}]] + "/balance/withdraw/check",
                //             data: {id: data.id, status: 2, reason: pass},
                //             success: function (res) {
                //                 if (res.success) {
                //                     layer.msg("操作完成", {icon: 1});
                //                     setTimeout(function () {
                //
                //                     }, 1500);
                //                     layer.close(index);
                //
                //                     tableIns.reload();
                //                 }
                //             }
                //         });
                //         layer.close(index);
                //     });
                // });
            }

            if (obj.event === 'updateS') {

                layer.confirm("确定" + (data.user.status == 0 ? "暂停(账号不能再登陆)" : "开启") + "账号状态?", {
                    icon: 3,
                    title: '提示'
                }, function (index) {
                    $.ajax({
                        type: "post",
                        url: [[${basePath}]] + "/user/status/update",
                        data: {id: data.user.id},
                        success: function (res) {
                            if (res.success) {
                                layer.msg("操作完成", {icon: 1});
                                setTimeout(function () {

                                }, 1500);
                                layer.close(index);

                                tableIns.reload();
                            }
                        }
                    });


                }, function (index) {
                    console.log(data.user.status);
                    obj.update({
                        status: "1111"
                    });

                });
            }

            if (obj.event === 'reset') {

                layer.confirm('确定重置此账号密码?', {icon: 3, title: '提示'}, function (index) {

                    $.ajax({
                        type: "post",
                        url: [[${basePath}]] + "/user/password/reset",
                        data: {id: data.user.id},
                        success: function (data) {
                            if (data.success) {
                                layer.msg("重置密码成功！", {icon: 1});

                            }
                        }
                    });


                    layer.close(index);
                });

            }
        });


        form.on('select(status)', function (data) {
            console.log(data.elem); //得到select原始DOM对象
            status = (data.value); //得到被选中的值
            console.log(data.othis); //得到美化后的DOM对象
        });




        $("#search").click(function () {
            tableIns.reload({
                where: {
                    name: $("input[name='name']").val()
                    , userId: $("input[name='userId']").val()
                    , status: status
                    , checkTime: $("#checkTimeId").val()
                    ,recommendCode: $("input[name='recommendCode']").val()
                },
                page: {
                    curr: 1
                }
            });
        })



    });

    function seeBigImg(img) {
        layer.open ({
            type: 1,
            title: false,
            closeBtn: 1,
            area: ['auto', 'auto'],
            content: '<img src="' + img + '" style="max-width: 100%; max-height: 100%;">'
        });
    }
</script>
<!-- 表格操作按钮集 -->
<script type="text/html" id="barOption">
    <!--<i class="layui-icon layui-icon-edit" style="cursor: pointer" lay-event="groupMember" title="审核"></i>-->
    <!--<i class="layui-icon layui-icon-edit" lay-event="edit"></i>-->
</script>
</body>
</html>